<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>Finalove-App-newFriends</title>
		<link rel="stylesheet" href="../../resource/font/css/font-awesome.min.css">
		<link rel="stylesheet" href="../../resource/css/mint.css">
		<link rel="stylesheet" href="../../resource/css/style.css">
		<script src="../../resource/js/vue.js"></script>
		<script src="../../resource/js/mint.min.js"></script>
		<script src="../../resource/js/jquery.min.js"></script>
		<style type="text/css">
			#main {
				background-color: #f0f0f0;
				overflow-y:auto ;
			}
			.ct-box {
				margin-top:40px;
			}
			.search-box img {
				margin-left: 15px;
			}
			.search-box .mint-cell-title {
				flex:0;
			}
			.apply-list .mint-cell-wrapper img{
				margin-top: 10px;
				margin-right: 15px;
				border-radius: 5px;
			}
			.apply-list .mint-cell-wrapper{
				margin-bottom: 5px;
			}
			.apply-list .mint-cell-wrapper .mint-button{
				margin-left: 10px;
			}
			.list-title {
				padding: 8px 10px;
				color:#606266;
			}
		</style>
	</head>
	<body>
		<div id="main">
			<mt-header fixed title="新的朋友">
				<mt-button icon="back" slot="left" @click="closeView"></mt-button>
			</mt-header>
			<div class="ct-box">
				<p class="list-title">添加好友</p>
				<div class="search-box"  @click="goTo('search.html','searchPage','pop-in',200)">
					<mt-cell>
						<img slot="icon" src="../../resource/icon/find.png" width="24" height="24">
						<mt-field placeholder="搜索用户名/邮箱" readonly></mt-field>
					</mt-cell>
				</div>
				<!-- <div class="search-box"  @click="goTo('nearby.html','nearbyPage','pop-in',200)">
					<mt-cell>
						<img slot="icon" src="../../resource/icon/nearby.png" width="24" height="24">
						<mt-field placeholder="附近的人" readonly></mt-field>
					</mt-cell>
				</div> -->
				<div class="search-box"  @click="goTo('scan.html','scanPage','fade-in',50)">
					<mt-cell>
						<img slot="icon" src="../../resource/icon/scan.png" width="24" height="24">
						<mt-field placeholder="扫一扫" readonly></mt-field>
					</mt-cell>
				</div>
				<div class="apply-list">
					<p class="list-title">好友申请</p>
					<mt-cell v-for="item in apply_list" :title="item.nick_name" :label="item.remark">
						<img slot="icon" :src="item.head" width="50" height="50">
						<mt-button @click="delApply(item.visitor_id)">删除</mt-button>
						<mt-button type="primary" @click="acceptApply(item.visitor_id)">接受</mt-button>
					</mt-cell>
					<p class="list-title text-center data-empty">暂无申请</p>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript">
		var main = new Vue({
			el:"#main",
			data:{
				apply_list:"",
			},
			mounted:function() {
				this.init();
			},
			methods:{
				init() {
					// 获取配置
					$.getJSON('../../resource/config.json',function(res){
						main.api_prefix = res.api_prefix;
						main.api_key = res.api_key;
						main.app_version = res.app_version;
						main.app_version_check_url = res.app_version_check_url;
					});
					document.addEventListener('plusready',function () {
						plus.navigator.setFullscreen(true);
						plus.key.addEventListener('backbutton', function() {
							plus.webview.currentWebview().close();
							return false;
						}, false);
						// 获取信息
						main.userInfo = {
							user_id:plus.storage.getItem("user_id"),
							user_name:plus.storage.getItem("user_name"),
							nick_name:plus.storage.getItem("nick_name"),
							email:plus.storage.getItem("email"),
							user_head:plus.storage.getItem("user_head"),
						}
						main.getApplyList();
					});
				},
				closeView() {
					plus.webview.currentWebview().close();
				},
				goTo(url,viewid,anim,duration) {
					plus.webview.close(viewid);
					var page = plus.webview.create(url,viewid);
					plus.webview.show(page,anim,duration);
				},
				delApply(id) {
					var url = this.api_prefix + "friends/disagreeApply";
					var param = {
						api_key:this.api_key,
						params:{
							to_id:plus.storage.getItem("user_id"),
							from_id:id
						},
					}
					$.post(url,param,function(res) {
						main.getApplyList();
						main.$toast(res.msg);
					});
				},
				acceptApply(visitor_id) {
					var url = this.api_prefix + "friends/agreeApply";
					var param = {
						api_key:this.api_key,
						params:{
							to_id:plus.storage.getItem("user_id"),
							from_id:visitor_id
						},
					}
					console.log(JSON.stringify(param));
					$.post(url,param,function(res) {
						main.$toast(res.msg);
						main.getApplyList();
						if(res.code == 1){
							var newFriends = plus.webview.currentWebview();
							var homePage = newFriends.opener();
							homePage.evalJS("main.getFriendListData()");
						}
					});
				},
				getApplyList() {
					var url = this.api_prefix + "friends/getApplyList";
					var param = {
						api_key:this.api_key,
						params:{
							"user_id":plus.storage.getItem("user_id"),
						},
					}
					$.post(url,param,function(res) {
						main.apply_list = res.data;
					});
				}
			}
		})
	</script>
</html>
